html {
  background-color: #fff;
  font: 12px 'Helvetica Neue', Helvetica, Arial, 'Microsoft Yahei', 'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', sans-serif;
}
body,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
p,
form {
  margin: 0;
}
ol,
li,
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
a {
  outline: 0;
  color: #00a1d6;
  text-decoration: none;
  cursor: pointer;
}
.clearfix {
  *zoom: 1;
}
.clearfix:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  overflow: hidden;
}
em,
i {
  font-style: normal;
  font-weight: normal;
}
/* 去除默认边框 */
fieldset,
img {
  border: none;
  vertical-align: middle;
}
.hide {
  display: none;
}
i {
  display: inline-block;
}
.primary-btn {
  border-radius: 4px;
  font-size: 14px;
  color: #6D757A;
  text-align: center;
  padding: 6.5px 0 6.5px 0;
  display: inline-block;
  background: #00A1D6;
  color: #fff;
  height: 19px;
  line-height: 19px;
  width: 120px;
}
.primary-btn:hover {
  background: #00b5e5;
}
.default-btn {
  width: 120px;
  border-radius: 4px;
  font-size: 14px;
  color: #6D757A;
  text-align: center;
  padding: 6.5px 0 6.5px 0;
  display: inline-block;
  height: 17px;
  line-height: 17px;
  border: 1px solid #CCD0D7;
}
.default-btn:hover {
  color: #00a1d6;
  background-color: #fff;
  border-color: #00a1d6;
}
.keyword {
  color: #f25d8e;
}
.icon-ic {
  font-size: 12px;
  margin-left: 6px;
  color: #99A2AA;
}
.list-null {
  text-align: center;
}
.list-null img {
  width: 260px;
  height: 240px;
  margin-bottom: 12px;
}
.list-null span {
  font-size: 12px;
  color: #99A2AA;
}
html .lazy-img {
  background-size: contain;
}
html .lazy-img img {
  background-color: #fff;
}
.bili-game-local .pager {
  text-align: center;
  margin: 12px 0;
}
.bili-game-local .pager .pages .page-item button {
  color: #6D757A;
  background-color: #F4F5F7;
  padding: 0 15px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #E5E9EF;
  margin: 0 4px;
}
.bili-msg {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
  font-style: normal;
  margin-top: 10px;
  transition: all 0.3s;
  opacity: 0;
  z-index: 20101;
}
.bili-msg.show {
  margin-top: 0;
  opacity: 1;
}
.bili-msg.error {
  background-color: rgba(228, 12, 12, 0.8);
}
.bili-msg .layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  z-index: -1;
  outline: none;
}
.match-model-body-msg {
  font-family: 'Microsoft YaHei';
  font-size: 12px;
  color: #757575;
  letter-spacing: 0;
  text-align: center;
  line-height: 20px;
}
.clear-fix::after {
  display: block;
  content: '';
  clear: both;
}
.grid-box {
  display: inline-table;
}
.grid-box .grid-item {
  display: table-cell;
}
.ring-text {
  font-size: 14px;
  color: #6d757a;
  text-align: center;
  margin-top: 10px;
  height: 20px;
  line-height: 20px;
}
.icon-melon-seeds {
  width: 20px;
  height: 20px;
  background: url();
  background-size: cover;
  display: inline-block;
}
.icon-coin {
  width: 20px;
  height: 20px;
  background: url();
  background-size: cover;
  display: inline-block;
}
.icon-menu {
  width: 20px;
  height: 20px;
  display: inline-block;
  position: relative;
}
.icon-menu::after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  top: 50%;
  left: 50%;
  margin-top: -8px;
  margin-left: -8px;
  background: url();
  background-size: contain;
  background-position: center;
}
.el-message {
  z-index: 99999999 !important;
}

.game-content {
  width: 1110px;
  margin: 0 auto;
}
.game-content .card-user {
  padding-left: 0;
}
.game-content .card-user .user-wrap:nth-child(7n+1) {
  margin-left: 0;
}
.international-footer .b-footer-wrap {
  width: 1110px !important;
}
.bili-header-m .bili-wrapper {
  width: 1110px !important;
}
.game-right-content {
  width: 830px;
}
@media screen and (min-width: 1440px) {
  .game-content {
    width: 1320px;
  }
  .game-content .card-user {
    padding-left: 46px;
  }
  .game-content .card-user .user-wrap:nth-child(7n+1) {
    margin-left: 68px;
  }
  .game-content .card-user .user-wrap:first-child {
    margin-left: 0;
  }
  .international-footer .b-footer-wrap {
    width: 1320px !important;
    padding-left: 46px;
  }
  .bili-header-m .bili-wrapper {
    width: 1320px !important;
  }
  .game-right-content {
    width: 1040px;
  }
}

@charset "utf-8";
/* CSS Document */
/* *{
  padding:0;
  margin:0;
  font-family: 'MicrosoftYaHei';
  -webkit-tap-highlight-color: rgba(255,255,255,0);
  tap-highlight-color: rgba(255,255,255,0);
} */
h1,h2,h3,h4,h5,h6{
  font-weight:normal;
  font-size:12px;
}
a{
  color:#00a1d6;
  text-decoration:none;
  font-size: 12px;
}
a:hover{
  color: #00b5e5;
}
ul,ol{
  list-style:none;
}
i,em{
  font-style:normal;
}
b,strong{
  font-weight:normal;
}
a img{
  border:none;
}
input,select{
  outline: none;
}
.text-strong{
  color: #00a1d6;
}
.clearfix::after{
  display:block;
  content:'';
  clear:both;
}
.float-left {
  float: left;
}
.btn-default,.btn-primary,.btn-default-mobile{
  min-height: 40px;
  min-width: 88px;
  text-align: center;
  line-height: 38px;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  display: inline-block;
  box-sizing: border-box;
  padding: 0 10px;
}
.btn-default{
  border: 1px solid #00a1d7;
  background: #00a1d7;
  color: #fff;
}
.btn-default-mobile{
  border: 1px solid #FB7299;
  background: #FB7299;
  color: #fff;
}
.btn-default:hover{
  border-color: #00b5e5;
  background-color: #00b5e5;
}
.btn-disabled{
  background: #ccd0d7;
  border-color: #ccd0d7;
  cursor: auto;
}
.btn-disabled:hover{
  background: #ccd0d7;
  border-color: #ccd0d7;
}
.btn-primary{
  border: 1px solid #e5e9ef;
  background: #ffffff;
  color: #99a2aa;
}
.btn-small{
  min-width: 52px;
  min-height: 28px;
  line-height: 28px;
}
.btn-middle{
  min-width: 120px;
  min-height: 32px;
  line-height: 30px;
}
.btn-full{
  width: 100%;
  height: 40px;
  line-height: 38px;
}

img[data-v-cf0a5f06] {
  margin: 0 auto 20px;
  display: block;
}
.error-text[data-v-cf0a5f06] {
  text-align: center;
  width: 320px;
  word-break: break-all;
}

.title[data-v-2b1f48b1] {
  font-family: HYQiHei-EZS;
  font-size: 16px;
  color: #212121;
  line-height: 19px;
  text-align: center;
}
.context[data-v-2b1f48b1] {
  font-family: HYQiHei-EZS;
  font-size: 13px;
  color: #757575;
  line-height: 20px;
  text-align: center;
  margin-top: 4px;
}
.popup-container[data-v-2b1f48b1] {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  text-align: center;
}

.mask[data-v-7fa55a0c] {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 100001;
}
.mask .popup-box[data-v-7fa55a0c] {
  background: #FFFFFF;
  border-radius: 4px;
  min-width: 340px;
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transform-origin: left top;
  -o-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -webkit-transform-origin: left top;
  animation: bounce-in-data-v-7fa55a0c 0.3s;
}
.mask .popup-box .popup-title[data-v-7fa55a0c] {
  height: 50px;
  border-bottom: 1px solid #E5E9EF;
  position: relative;
  text-align: center;
}
.mask .popup-box .popup-title h3[data-v-7fa55a0c] {
  font-family: MicrosoftYaHei;
  font-weight: bold;
}
.mask .popup-box .popup-title .popup-close[data-v-7fa55a0c] {
  width: 18px;
  height: 18px;
  background: url();
  position: absolute;
  right: 16px;
  top: 16px;
  cursor: pointer;
}
.mask .popup-box .popup-title .popup-close[data-v-7fa55a0c]:hover {
  background: url(//s1.hdslb.com/bfs/static/jinkela/game/70ba570d32b2963012e7.png);
}
.mask .popup-box .popup-content[data-v-7fa55a0c] {
  font-size: 14px;
  color: #222222;
  min-height: 100px;
  display: table;
  width: 100%;
}
.mask .popup-box .popup-container[data-v-7fa55a0c] {
  padding: 20px 40px 30px;
}
.mask .popup-box .popup-container .popup-btn[data-v-7fa55a0c] {
  text-align: center;
}
.mask .popup-box h3[data-v-7fa55a0c] {
  font-size: 16px;
  color: #222222;
  line-height: 50px;
  padding: 0 20px;
}
.fade-enter-active[data-v-7fa55a0c] {
  /*animation: bounce-mask .5s;*/
  transition: opacity 0.3s;
}
.fade-leave-active[data-v-7fa55a0c] {
  transition: opacity 0.3s;
}
.fade-leave-active .popup-box[data-v-7fa55a0c] {
  animation: bounce-out-data-v-7fa55a0c 0.3s;
}
.fade-leave-active .popup-box-m[data-v-7fa55a0c] {
  animation: bounce-out-m 0.3s;
}
.fade-enter[data-v-7fa55a0c],
.fade-leave-to[data-v-7fa55a0c] {
  opacity: 0;
}
@keyframes bounce-in-data-v-7fa55a0c {
0% {
    -webkit-transform: scale(0) translate(-50%, -50%);
    -moz-transform: scale(0) translate(-50%, -50%);
    -ms-transform: scale(0) translate(-50%, -50%);
    -o-transform: scale(0) translate(-50%, -50%);
    transform: scale(0) translate(-50%, -50%);
}
50% {
    -webkit-transform: scale(1.2) translate(-50%, -50%);
    -moz-transform: scale(1.2) translate(-50%, -50%);
    -ms-transform: scale(1.2) translate(-50%, -50%);
    -o-transform: scale(1.2) translate(-50%, -50%);
    transform: scale(1.2) translate(-50%, -50%);
}
100% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    -moz-transform: scale(1) translate(-50%, -50%);
    -ms-transform: scale(1) translate(-50%, -50%);
    -o-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
}
}
@keyframes bounce-out-data-v-7fa55a0c {
0% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    -moz-transform: scale(1) translate(-50%, -50%);
    -ms-transform: scale(1) translate(-50%, -50%);
    -o-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
}
50% {
    -webkit-transform: scale(1.2) translate(-50%, -50%);
    -moz-transform: scale(1.2) translate(-50%, -50%);
    -ms-transform: scale(1.2) translate(-50%, -50%);
    -o-transform: scale(1.2) translate(-50%, -50%);
    transform: scale(1.2) translate(-50%, -50%);
}
100% {
    -webkit-transform: scale(0) translate(-50%, -50%);
    -moz-transform: scale(0) translate(-50%, -50%);
    -ms-transform: scale(0) translate(-50%, -50%);
    -o-transform: scale(0) translate(-50%, -50%);
    transform: scale(0) translate(-50%, -50%);
}
}

.lazy-img {
  background: url() center center no-repeat;
  width: 100%;
  height: 100%;
  display: inline-block;
}
.lazy-img img {
  display: block;
  width: 100%;
  height: 100%;
}
.lazy-img img[src=''] {
  opacity: 0;
}

.game-banner {
  max-width: 2560px;
  width: 100%;
  margin: 0 auto 32px;
  margin-top: -56px;
  position: relative;
}
.game-banner .line-ellipsis {
  display: -webkit-box;
  overflow: hidden;
  /* autoprefixer: off */
  -webkit-box-orient: vertical;
  text-overflow: -o-ellipsis-lastline;
  text-overflow: ellipsis;
  word-break: break-all;
  -webkit-line-clamp: 1;
}
.game-banner img {
  width: 100%;
  height: 100%;
}
.game-banner .banner {
  height: 500px;
  background: #ccc;
}
.game-banner .banner .banner-wrapper {
  width: 100%;
  position: relative;
}
.game-banner .banner .banner-wrapper .banner-content {
  width: 100%;
  height: 500px;
  margin: 0 auto;
  background-size: auto 100%;
  background-position: center;
  transition: all 0.5s ease-in-out;
  display: block;
}
.game-banner .banner .banner-wrapper .top-cover {
  position: absolute;
  width: 100%;
  height: 106px;
  left: 0px;
  top: 0px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
}
.game-banner .banner .banner-wrapper .banner-slider-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  width: 250px;
  padding-top: 56px;
  box-sizing: border-box;
  height: 500px;
  background-color: rgba(16, 20, 32, 0.8);
  backdrop-filter: blur(10.8731px);
  /* Note: backdrop-filter has minimal browser support */
  display: flex;
  align-items: center;
}
.game-banner .banner .banner-wrapper .banner-slider {
  width: 100%;
  cursor: pointer;
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item {
  text-align: left;
  padding: 14px 18px;
  box-sizing: border-box;
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item .title {
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #fff;
  /* identical to box height */
  text-align: left;
  mix-blend-mode: normal;
  opacity: 0.6;
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item .info {
  font-size: 12px;
  line-height: 16px;
  color: #fff;
  display: none;
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item.active {
  height: 73px;
  background: linear-gradient(0deg, rgba(20, 142, 183, 0.1), rgba(20, 142, 183, 0.1));
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item.active .title {
  transition: font-size 0.2s ease-in-out;
  font-weight: 500;
  font-size: 18px;
  line-height: 25px;
  margin: 0 0 2px;
  opacity: 1;
}
.game-banner .banner .banner-wrapper .banner-slider .banner-item.active .info {
  display: -webkit-box;
}
.game-banner .banner-title {
  width: 100%;
  box-sizing: border-box;
  background: rgba(13, 18, 29, 0.9);
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.2);
}
.game-banner .banner-title .title-content {
  margin: 0 auto;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.game-banner .banner-title .title-content ul {
  flex-shrink: 0;
  overflow: hidden;
}
.game-banner .banner-title .title-content ul li {
  font-size: 16px;
  margin-right: 36px;
  cursor: pointer;
  float: left;
}
.game-banner .banner-title .title-content ul li.active a {
  color: #00a1d6;
  border-bottom: 2px solid #00a1d6;
}
.game-banner .banner-title .title-content ul li a {
  font-size: 14px;
  display: inline-block;
  height: 42px;
  line-height: 42px;
  color: rgba(255, 255, 255, 0.6);
}
.game-banner .banner-title .title-content .game-search {
  flex-shrink: 1;
  width: 240px;
  height: 28px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 76px;
  position: relative;
}
.game-banner .banner-title .title-content .game-search form {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  padding: 0 30px 0 40px;
  box-sizing: border-box;
}
.game-banner .banner-title .title-content .game-search span {
  color: #fffdff;
}
.game-banner .banner-title .title-content .game-search .sousuo-dir {
  position: absolute;
  top: 5px;
  right: 12px;
  color: #fff;
  opacity: 0.4;
  cursor: pointer;
}
.game-banner .banner-title .title-content .game-search input {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: "Microsoft YaHei";
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}
.game-banner .banner-title .title-content .game-search .icon-sousuo {
  cursor: pointer;
  width: 16px;
  height: 16px;
  line-height: 16px;
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translate(0, -50%);
}

html {
  height: 100%;
}
body {
  min-height: 100%;
  position: relative;
}
.international-footer {
  bottom: 0;
}
.z-top-container {
  min-height: 42px;
}
.international-header.custom-header {
  max-width: 2560px;
  margin: 0 auto;
}
.international-header.custom-header .mini-type,
.van-popover .mini-type {
  background: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.international-header.custom-header:not(.fixed-top) .mini-type .nav-link .nav-link-ul .nav-link-item .link {
  color: #fff;
}
.international-header.custom-header:not(.fixed-top) .mini-type .nav-link .nav-link-ul .nav-link-item .link:hover {
  color: #fff;
}
.custom-header .mini-type .nav-user-center .user-con .item .name,
.nav-link .nav-link-ul.mini .bili-icon_dingdao_xiazaiapp,
.nav-link .nav-link-ul .nav-link-item .link .bili-Navbar_logo {
  color: #fff;
}
@font-face {
  font-family: 'xx-bin';
  src: url(//s1.hdslb.com/bfs/static/jinkela/game/3586ec851b78bbb713be.ttf) format('opentype');
}

/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
@font-face {
  font-family: 'iconfont-match';
  /* Project id 4119641 */
  src: url('//at.alicdn.com/t/c/font_4119641_2oxj581wps8.eot?t=1686629362394');
  /* IE9 */
  src: url('//at.alicdn.com/t/c/font_4119641_2oxj581wps8.eot?t=1686629362394#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('//at.alicdn.com/t/c/font_4119641_2oxj581wps8.woff?t=1686629362394') format('woff'), url('//at.alicdn.com/t/c/font_4119641_2oxj581wps8.ttf?t=1686629362394') format('truetype'), url('//at.alicdn.com/t/c/font_4119641_2oxj581wps8.svg?t=1686629362394#iconfont-match') format('svg');
}
.iconfont-match {
  font-family: "iconfont-match" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.iconfont-match-up:before {
  content: "\e603";
}
.iconfont-match-danmu::before {
  content: "\e604";
}
.iconfont-match-play:before {
  content: "\e601";
}
.iconfont-match-duration:before {
  content: "\e602";
}

